<!DOCTYPE html>
<html>

<head>
    <title></title>
    <script src="Vue-2.0.0.js"></script>
    <style type="text/css">
    .content {
        position: relative;
        width: 960px;
        height: auto;
        margin: 0 auto;
        padding: 20px 0;
    }
    
    fieldset {
        position: relative;
        display: block;
        margin-bottom: 20px;
    }
    </style>
</head>

<body>
    <div class="content">
        <!-- ============================================ -->
        <!-- 前言 -->
        <!-- ============================================ -->
        <fieldset>
            <legend>前言</legend>
            <p>接下来就是讲事件和浏览器本身的控件...</p>
            <p>这些可能牵扯很多基础和浏览器对事件和控件的解释</p>
        </fieldset>

        <!-- ============================================ -->
        <!-- 事件 -->
        <!-- ============================================ -->
        <fieldset>
            <legend>v-bind 和 v-on 事件</legend>
            <p>v-bind: 可以简写 ":"</p>
            <p>v-on: 可以简写 "@"</p>
            <p>Vue 提供了很多简写的事件写法</p>
        </fieldset>
        <!-- ============================================ -->
        <!-- 表单控件绑定 -->
        <!-- ============================================ -->
        <fieldset>
            <legend>表单控件绑定</legend>
            <p>用 v-model 指令在表单控件元素上创建双向数据绑定</p>
        </fieldset>
        
        <!-- 可以组件了 -->
        <h2>组件</h2>
        <!-- ============================================ -->
        <!-- 使用组件 -->
        <!-- ============================================ -->
        <fieldset>
            <legend>使用组件</legend>
            <p>组件（Component）是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。在较高层面上，组件是自定义元素， Vue.js 的编译器为它添加特殊功能。在有些情况下，组件也可以是原生 HTML 元素的形式，以 is 特性扩展。</p>

        </fieldset>


        <b>
        	思考：<br />
        	Vue 很多地方，会出现说：不要这样，要那样，的情况。<br />
        	搞个专栏吧。
        </b>





























    </div>

</body>
</html>